<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
	<style type="text/css">
		body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}
	</style>
     <link rel="stylesheet" href="https://cache.amap.com/lbs/static/main1119.css"/>
    <link rel="stylesheet" href="/static/css/bootstrap.min.css" rel="stylesheet">
	<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=UbgpmP5FNlbvvq1q3mhcegEvzRwyoh1q"></script>
	<title>地图</title>
</head>
<body>
	<div id="allmap"></div>
<div id="myPageTop">
    <table>
        <tr>
            <td>
                <label>请输入关键字：</label>
            </td>
        </tr>
        <tr>
            <td>
        <input type="text" id="keyword" onkeypress="getKey();"/>
            </td>
        </tr>
    </table>
</div>
<nav class="navbar navbar-default navbar-fixed-bottom">
  <div class="container">
<form role="form" action="{% url 'navigation' %}" method="get">
	<div class="form-group">
		<label for="name">标签</label>
		<input type="text" name="origin" class="form-control" placeholder="输入你的起点">
		<input type="text" name="destination" class="form-control" placeholder="输入你的终点">
			<select class="form-control" name="way">
			<option>驾车</option>
			<option>步行</option>
			<option>公交车</option>
		</select>
        <button type="submit" class="btn" >查询</button>
	</div>
 </form>
  </div>
</nav>
</body>
</html>
<script type="text/javascript">
    var lng = 116;
    var lat = 39;
	// 百度地图API功能
	var map = new BMap.Map("allmap");
	var point = new BMap.Point(116.331398,39.897445);
	map.centerAndZoom(point,14);
	map.centerAndZoom(point, 14);
    map.enableScrollWheelZoom();
    map.enableInertialDragging();

    map.enableContinuousZoom();

    var size = new BMap.Size(10, 20);
    map.addControl(new BMap.CityListControl({
        anchor: BMAP_ANCHOR_TOP_LEFT,
        offset: size,
        // 切换城市之间事件
        // onChangeBefore: function(){
        //    alert('before');
        // },
        // 切换城市之后事件
    {#     onChangeAfter:function(){#}
    }
    ));

	var geolocation = new BMap.Geolocation();
	geolocation.getCurrentPosition(function(r){
		if(this.getStatus() == BMAP_STATUS_SUCCESS){
			var mk = new BMap.Marker(r.point);
			map.addOverlay(mk);
			map.panTo(r.point);
			lng = r.point.lng;
			lat = r.point.lat;
		}
		else {
			alert('failed'+this.getStatus());
		}
	},{enableHighAccuracy: true});

    function getKey()
{
    if(event.keyCode==13){
        var keyword = document.getElementById("keyword").value;
        	var map = new BMap.Map("allmap");            // 创建Map实例
            map.centerAndZoom(new BMap.Point(lng, lat), 11);
            var local = new BMap.LocalSearch(map, {
                renderOptions: {map: map, panel: "r-result"}
            });
            local.search(keyword);
    }
}
	{## 查询功能#}

    	// 百度地图API功能


	//关于状态码
	//BMAP_STATUS_SUCCESS	检索成功。对应数值“0”。
	//BMAP_STATUS_CITY_LIST	城市列表。对应数值“1”。
	//BMAP_STATUS_UNKNOWN_LOCATION	位置结果未知。对应数值“2”。
	//BMAP_STATUS_UNKNOWN_ROUTE	导航结果未知。对应数值“3”。
	//BMAP_STATUS_INVALID_KEY	非法密钥。对应数值“4”。
	//BMAP_STATUS_INVALID_REQUEST	非法请求。对应数值“5”。
	//BMAP_STATUS_PERMISSION_DENIED	没有权限。对应数值“6”。(自 1.1 新增)
	//BMAP_STATUS_SERVICE_UNAVAILABLE	服务不可用。对应数值“7”。(自 1.1 新增)
	//BMAP_STATUS_TIMEOUT	超时。对应数值“8”。(自 1.1 新增)
</script>
<script src="/static/js/jquery-1.11.3.min.js"></script>
<script src="/static/js/bootstrap.min.js"></script>